<template>
	<div>
		<div class="recommend-title">周末去哪儿</div>
		<ul>
			<li class="item" v-for="item of list" :key="item.id">
			   <div class="item-img-wrap" >
				<img class="item-img" :src="item.imgUrl">
               </div>	
               <div class="item-info ">
               	 <p class="item-title general">{{item.title}}</p>
               	 <p class="item-desc general" style="color: #eee;">{{item.desc}}</p>
               </div>
			</li>
		</ul>
	</div>
</template>

<script>
export default{

name:'weekend',
props:{
	list:Array
 }
}
</script>

<style lang="stylus" scoped>

@import '~styles/mixins.styl'
  .general
  	padding:.1rem
 .recommend-title
 	line-height: 0.8rem
 	margin-top:.2rem
 	background:#eee
 	text-indent:.2rem
 .item
 	margin-bottom: .2rem;	
 	.item-info
 		padding:.1rem
 	.item-desc		
 		color:#eee
 		ellipsis()
 	.item-title
 		line-height:.54rem
 		font-size:.32rem
 		ellipsis()
 		.price-style
 			color:orange
 			font-size:.14rem
 	.item-img-wrap
 		overflow: hidden;
 		padding-bottom: 37.09%
 		height:0
 		width:100%
 	 .item-img
 		 width:100%
</style>